<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>布局练习</title>
<link href="../../css/layout.css" rel="stylesheet" type="text/css" />

</head>
<body>

	<!-- 宽度 -->
	<div class="divcss5">
		<p class="p_width">我的宽度为200px</p>
	</div>
	<!--高度  -->
	<div id="divcss5">我高度为200px</div>
	<!--边框  -->
	<div id="border">我的高度为100px,宽度为200px,边框为1px</div>
	<!--背景拼图  -->
	<div id="Sprites_div">
		<ul class="Sprites">
			<li><span class="a1"></span><a href="#">WORD文章标题</a></li>
			<li><span class="a2"></span><a href="#">PPT内容标题</a></li>
			<li><span class="a3"></span><a href="#">Excel内容标题</a></li>
			<li><span class="a4"></span><a href="#">PDF内容标题</a></li>
			<li><span class="a5"></span><a href="#">文本文档标题</a></li>
		</ul>
	</div>
	<!-- 浮动 -->
	
	<div class="divcss5"> 
    <div class="divcss5_left">布局靠左浮动</div> 
    <div class="divcss5_right">布局靠右浮动</div> 
    <div class="clear"></div><!-- html注释：清除float产生浮动 --> 
    
    
    <dl>
      <dt>WORD文章标题</dt>
      <dd>PPT内容标题</dd>
    </dl>
    
</div>
 
</body>
</html>